/**
 * 封装Button组件
 * @author xiaoxujs
 */

import { FC } from "react"
import { ButtonInfoBox, ButtonPrimaryBox } from "./style"

const ButtonX: FC<{
    type?: 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'text' | 'default' | undefined, // 按钮类型
    children: React.ReactNode, // 按钮内容
    onClick?: () => void, // 点击事件
    style?: React.CSSProperties, // 按钮样式
}> = ({
    type = 'primary', // 按钮类型
    children, // 按钮内容
    onClick, // 点击事件
    style
}) => {
        const handleButtonHtml = () => {
            if (type === 'primary') {
                return <ButtonPrimaryBox style={style} onClick = {onClick}>
                    {children}
                </ButtonPrimaryBox>
            } else if (type === 'info') {
                return <ButtonInfoBox style={style} onClick = {onClick}>
                    {children}
                </ButtonInfoBox>
            } else {
                return <ButtonPrimaryBox style={style} onClick={onClick}>
                    {children}
                </ButtonPrimaryBox>
            }
        }
        return handleButtonHtml()
    }
export default ButtonX;


// type?: 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'text' | 'default' | undefined, // 按钮类型
// onClick?: () => void, // 点击事件
// children?: React.ReactNode, // 按钮内容
// disabled?: boolean, // 是否禁用
// loading?: boolean, // 是否加载中
// shape?: 'circle' | 'round' | undefined, // 按钮形状
// size?: 'large' | 'middle' | 'small' | undefined, // 按钮大小
// block?: boolean, // 是否块级元素
// ghost?: boolean, // 是否幽灵按钮
// danger?: boolean, // 是否危险按钮
// icon?: React.ReactNode, // 图标
// href?: string, // 链接地址
// target?: '_blank' | '_self' | '_parent' | '_top' | undefined, // 链接目标
// htmlType?: 'button' | 'submit' | 'reset' | undefined, // 表单提交类型
// autoFocus?: boolean, // 是否自动聚焦
// form?: string, // 表单名称
// name?: string, // 表单名称
// value?: string, // 表单值
// tabIndex?: number, // 标签索引
// title?: string, // 标题
// ariaLabel?: string, // 无障碍标签
// role?: string, // 角色
// ariaDescribedBy?: string, // 无障碍描述
// ariaHidden?: boolean, // 无障碍隐藏
// ariaControls?: string, // 无障碍控制
// ariaPressed?: boolean, // 无障碍按下
// ariaChecked?: boolean, // 无障碍选中
// ariaDisabled?: boolean, // 无障碍禁用
// ariaReadOnly?: boolean, // 无障碍只读
// ariaRequired?: boolean, // 无障碍必填
// ariaInvalid?: boolean, // 无障碍无效
// ariaBusy?: boolean, // 无障碍繁忙
// ariaLive?: 'assertive' |'polite' | undefined, // 无障碍活的
// ariaAtomic?: boolean, // 无障碍原子
// ariaRelevant?: string, // 无障碍相关
// ariaAutoComplete?: 'none' |'inline' |'list' |'both' | undefined, // 无障碍自动完成
// ariaHasPopup?: boolean, // 无障碍有弹出
// ariaOwns?: string, // 无障碍拥有
// ariaActiveDescendant?: string, // 无障碍活动描述endant
// ariaFlowTo?: string, // 无障碍流向
// ariaLabeledBy?: string, // 无障碍标签by